import React from 'react'
import styles from './Bangzhu.module.css'
import { NavBar,Tabs,Cell,Search,Collapse   } from 'react-vant';
import {useNavigate} from 'react-router-dom'
export default function Bangzhu() {
  const navigate = useNavigate()
  const [value, setValue] = React.useState('');
  return (
    <div>
       <NavBar
        title='帮助中心'
        leftText='返回'
        onClickLeft={() => navigate('/home/my')}
      />
      <Tabs>
        <Tabs.TabPane title="常见问题">
        <Search
          value={value}
          onChange={setValue}
          placeholder="请输入搜索关键词"
          // showAction
          onSearch={(val) => {
            
            setValue(val);
          }}
          onCancel={() => {
            
            setValue('');
          }}
          onClear={() => {
          
            setValue('');
          }}
          onClickInput={() => {
            
          }}
        />
        <Collapse initExpanded={['2']}>
          <Collapse.Item title="我们的服务流程是什么？" name="1">
            代码是写出来给人看的，附带能在机器上运行
          </Collapse.Item>
          <Collapse.Item title="费用是如何进行计算的？" name="2">
          我们有一个费用计算工具供我们的工作人员与您确认具体的费用信息。您可以直接联系工作人员进行费用咨询。
          </Collapse.Item>
          <Collapse.Item title="我可以获得赔偿吗？" name="3">
            代码是写出来给人看的，附带能在机器上运行
          </Collapse.Item>
        </Collapse>
        </Tabs.TabPane>
        <Tabs.TabPane title="客户服务">
        <Cell
          center
          title={'在线客服'}
          isLink
          onClick={()=>navigate('/kefu')}
        />
        <Cell
          center
          title={'客服电话'}
          isLink
        />
        <Cell
          center
          title={'微信咨询'}
          isLink
        />
        </Tabs.TabPane>
      </Tabs>
    </div>
  )
}
